<template>
  <a-radio-group class='a-row-under' style='height: auto' v-if="tagType=='radioButtonNew'" @change='handleInput'
                 :value='getValueSting' :disabled='disabled'>
    <a-radio-button v-for='(item, key) in dictOptions' style='background: #f3f3f3;margin-left: 12px;border: none;'
                    :key='key' :value='item.value'>{{ item.text || item.label }}
    </a-radio-button>
  </a-radio-group>

  <a-radio-group class='a-row-under' style='height: auto;' v-else-if="tagType=='radioButtonNewKuang'"
                 @change='handleInput' :value='getValueSting' :disabled='disabled'>
    <a-radio-button v-for='(item, key) in dictOptions' style='background: #f3f3f3;margin-left: 12px;' :key='key'
                    :value='item.value'>{{ item.text || item.label }}
    </a-radio-button>
  </a-radio-group>
</template>

<script>
import { ajaxGetDictItems, getDictItemsFromCache } from '@/api/api'

export default {
  name: 'SDictSelectTag',
  props: {
    dictCode: String,
    placeholder: String,
    disabled: Boolean,
    value: [String, Number],
    type: String,
    options: Array,
    getPopupContainer: {
      type: Function,
      default: (node) => node.parentNode
    }
  },
  data() {
    return {
      tagType: '',
      dictOptions: []
    }
  },
  watch: {
    options: function(val) {
      this.setDictOptions(val)
    },
    dictCode: {
      immediate: true,
      handler() {
        this.initDictData()
      }
    }
  },
  created() {
    // console.log(this.dictCode);
    if (!this.type) {
      this.tagType = 'radioButtonNew'
    } else {
      this.tagType = this.type
    }
    //获取字典数据
    // this.initDictData();
  },
  computed: {
    getValueSting() {
      // update-begin author:wangshuai date:20200601 for: 不显示placeholder的文字 ------
      // 当有null或“” placeholder不显示
      return this.value != null ? this.value.toString() : undefined
      // update-end author:wangshuai date:20200601 for: 不显示placeholder的文字 ------
    }
  },
  methods: {
    initDictData() {
      if (this.options && this.options.length > 0) {
        this.dictOptions = [...this.options]
      } else {
        //优先从缓存中读取字典配置
        if (getDictItemsFromCache(this.dictCode)) {
          this.dictOptions = getDictItemsFromCache(this.dictCode)
          return
        }
        //根据字典Code, 初始化字典数组
        ajaxGetDictItems(this.dictCode, null).then((res) => {
          if (res.success) {
            this.dictOptions = res.result
          }
        })
      }
    }
    ,
    handleInput(e = '') {
      let val
      if (Object.keys(e).includes('target')) {
        val = e.target.value
      } else {
        val = e
      }
      console.log(val)
      this.$emit('change', val)
      //LOWCOD-2146 【菜单】数据规则，选择自定义SQL 规则值无法输入空格
      this.$emit('input', val)
    }
    ,
    setDictOptions(dictOptions) {
      this.dictOptions = dictOptions
      console.log(this.dictOptions)
    }
    ,
    getCurrentDictOptions() {
      return this.dictOptions
    }
  },
  model: {
    prop: 'value',
    event: 'change'
  }
}
</script>

<style scoped>
::before {
  width: 0px !important;
}
</style>